// 秒杀组件
import { useEffect, useState, useRef } from 'react'
function MiaoSha(props) {
    const [time, setTime] = useState(props.initCount)
    const timeout = useRef(null)
    useEffect(() => {
        const timer = setInterval(() => {
            if (time > 1) {
                setTime(time - 1)
                timeout.current.classList.remove('animate__animated', 'animate__zoomIn')
                timeout.current.offsetWidth; // 触发重绘
                timeout.current.classList.add('animate__animated', 'animate__zoomIn')
            } else {
                setTime('秒杀开始！')
                clearInterval(timer)
            }
        }, 1000)
        return () => {
            clearInterval(timer)
        }
    }, [time])
    return <h1  style={{ color: 'red' }} ref={timeout} >{time}</h1>
}
export default MiaoSha